<template>
	<view class="m-pay-modes">
		<u-action-sheet
			:show="show"
			@close="close"
			:title="$t('m_pay_mode.action-title')"
			:round="10"
		>
			<view class="p-b-md" v-if="actionShow">
				<!-- 获取支付状态 -->
				<view class="m-md">
					<u-loading-icon mode="circle" size="28rpx" text="正在支付" ></u-loading-icon>
				</view>
			</view>
			<view class="modes" v-if="modesShow">
				<!-- 支付选项 -->
				<u-radio-group 
					size="45rpx"
					iconSize="40rpx"
					labelSize="40rpx"
					placement="column" 
					v-model="paymode"
				>
					<u-radio
						:label="$t('m_pay_mode.action-mode-1')"
						name="1"
						activeColor="#2d8cf0"
						@change="radioChange"
						v-if="configInfo.alipay_open == 1"
					>
					</u-radio>
					<u-radio
						:label="$t('m_pay_mode.action-mode-2')"
						name="2"
						activeColor="#36b368"
						@change="radioChange"
						v-if="configInfo.wxpay_open == 1"
					>
					</u-radio>
					<u-radio
						:label="'金币支付('+userInfo.money+')'"
						name="3"
						activeColor="#ffd426"
						@change="radioChange"
						v-if="moneyPay == 1 && userInfo"
					>
					</u-radio>
				</u-radio-group>
				<view class="btns">
					<u-button shape="circle" :color="configInfo.mainColor" :loading="loading" :disabled="loading" loadingText=" " :text="$t('m_pay_mode.action-btn')" @click="pay" :style="{'color':configInfo.btnColor}"></u-button>
				</view>
			</view>
			
		</u-action-sheet>
	</view>
</template>

<script>
	import {
		mapState,
		mapActions,
		mapMutations
	} from "vuex"
	export default {
		name:"m-pay-modes",
		props: ['show','moneyPay'],
		data() {
			return {
				loading:false,
				paymode:'',
				orderNum:'',
				modesShow:true,
				actionShow:false
			};
		},
		computed: mapState({
			userInfo: state => state.user.userInfo,
			configInfo: state => state.config.configInfo,
		}),
		methods:{
			close(){
				this.$emit('close')
			},
			radioChange(n) {
				this.paymode = n;
				// console.log('radioChange', n);
			},
			
			pay(){
				// 点击确认支付按钮
				if(!this.paymode){
					this.$util.showToast(this.$t('m_pay_mode.action-title'))
					return false;
				}
				this.loading = true
				this.$emit('action',this.paymode)
			},
			
			async action(orderNum){
				this.orderNum = orderNum
				this.modesShow = false
				this.actionShow = true
				let params = {
					order_num	:	this.orderNum,
					is_weixin	:	false
				}
				let res = await this.$api.pay.snedPay(params)
				if (this.$wechat.isWechat()) {
					// 微信浏览器
					params['is_weixin'] = 1;
				}
				if(res.code == 200){
					let thos = this
					if(thos.paymode == 1){
						// 支付宝直接打开新页面跳转支付
						thos.openPay(res.data);
					}else{
						// 微信则需判断是否在微信浏览器内部
						if (thos.$wechat.isWechat()) {
							WeixinJSBridge.invoke(
							    'getBrandWCPayRequest',
							    res.data,
							    function(res2){
							        if(res2.err_msg == "get_brand_wcpay_request:ok" ){
							            window.location.href = location.href;
							        } else if (res2.err_msg == 'get_brand_wcpay_request:fail') {
							           alert(res2.err_code+res2.err_desc+res2.err_msg);
							        }
								}
							);
						}else{
							thos.openPay(res.data);
						}
					}
					// 开启检测订单
					this.checkOrder()
				}else{
					this.$ref.show = false
				}
				
				// if(!orderNum){
				// 	this.$util.showToast(this.$t('m_pay_mode.order-fail'))
				// 	return false;
				// }
				// this.orderNum = orderNum;
				// uni.showLoading({title:this.$t('m_pay_mode.paying')});
				// // 支付
				// let subData = new Object;
				// subData['order_num'] = this.orderNum;
				// subData['pay_method'] = this.paymode;
				// subData['is_weixin'] = false;
				// if (this.$wechat.isWechat()) {
				// 	// 微信浏览器
				// 	subData['is_weixin'] = true;
				// }
				// let res = await this.$api.content.pay(subData)
				// console.log(res)
				// if(res.code == 200){
				// 	let thos = this
				// 	this.$util.showToast(res.msg,function(){
				// 		thos.$emit('close')
				// 		// 打开支付页面
				// 		if(thos.paymode == 1){
				// 			// 支付宝直接打开新页面跳转支付
				// 			thos.openPay(res.data);
				// 		}else{
				// 			// 微信则需判断是否在微信浏览器内部
				// 			if (thos.$wechat.isWechat()) {
				// 				WeixinJSBridge.invoke(
				// 				    'getBrandWCPayRequest',
				// 				    res.data,
				// 				    function(res2){
				// 				        if(res2.err_msg == "get_brand_wcpay_request:ok" ){
				// 				            window.location.href = location.href;
				// 				        } else if (res2.err_msg == 'get_brand_wcpay_request:fail') {
				// 				           alert(res2.err_code+res2.err_desc+res2.err_msg);
				// 				        }
				// 					}
				// 				);
				// 			}else{
				// 				thos.openPay(res.data);
				// 			}
				// 		}
				// 	});
				// }
				// this.loading = false
				// // 订单号存在，定期获取状态
				// // console.log(res);
				// // 通过订单号发起支付
				
				// // 正在支付
				// // uni.showLoading({title:"正在支付..."});
				// // 执行动作
				// // alert(num)
			},
			
			// 检测订单状态
			checkOrder(){
				let order_num = this.checkOrder
				// if(order_num){
					
				// }
			},
			
			openPay(url){
				uni.navigateTo({
					url: '/pages/pay/pay?order_num='+this.orderNum,
					success: function(res) {
						// 通过eventChannel向被打开页面传送数据
						res.eventChannel.emit('acceptDataFromOpenerPage', { 
							url:url
						})
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	.u-radio-group{
		justify-content: center;
		margin: 10px 0;
		align-items: center;
	}
	/deep/ .u-radio{
		margin: 10px;
		&__text{
			width: 200rpx!important;
		}
	}
	.btns{
		width: 320rpx;
		margin: 30rpx auto;
	}
	
</style>